<!DOCTYPE html>
<html lang="en">
<head>
  <base href=""/>
  <meta charset="UTF-8">
  <title>桩实时状态详情</title>
  <link type="text/css" rel="stylesheet" href="../static/css/bootstrap.min.css"/>
  <link type="text/css" rel="stylesheet" href="../static/css/common.css"/>
  
  <script type='text/javascript' src='../static/js/jquery-1.10.2.min.js'></script>
  <script type='text/javascript' src='../static/js/bootstrap.min.js'></script>
  <script type="text/javascript" src="../static/js/common.js"></script>
  <script type="text/javascript" src="../static/js/messageContent.js"></script>
  <script type='text/javascript' src='../static/js/echarts.js'></script>
  <script type="text/javascript" src="../static/js/equipmentRealTimeDetail.js"></script>
  <script type="text/javascript" src="../static/table/equipmentRealTimeDetailTable.js"></script>
</head>
<body>
	<div class="detalisTop">
		  <div class="top" style="padding-left:3%;">
		<h4 class="partTitle"> 
	         <span class="detalisBack" onclick="goback();"></span>
	         	当前位置: 充电桩 <span class="comSpanTitle">></span><a onclick="goback();">实时状态</a><span class="comSpanTitle">></span>详情
	       </h4>
	  </div>
	  <div class="blue"></div>
	  </div>
	 <div class="partDetalis">
	 <form class="form-horizontal" id="equipmentStatusForm">
	       <input id="page" name = "page" hidden = "hidden" value = "1">
	       <input id="rows" name = "rows" hidden = "hidden" value = "15">
	       <input id="ID" name = "ID" hidden = "hidden">
	 </form> 
	  <div id="errorInfo" style="color: red;"></div>
      <div class="partTable">
      	<div class="col-sm-12 oneWidth">
      	<div>
	        <div class="col-sm-4 AhalfWidth">
              	<div class="comTitle bacLightGreen fontWhite"><span class="borWhite"></span><span id="chargingStationNameTitle">XX充电站</span></div>
              	<div class="comBody bacWhite">
              		<div class="col-sm-4"><img src="../static/images/equipmentGreen.png"></div>
              		<div class="col-sm-8"  id="detailOneBody"></div>
              	</div>
            </div>
            <div class="col-sm-8 AhalfWidth">
              	<div class="comTitle bacWhite"><span class="borBlue"></span>电池信息</div>
              	<div class="comBody bacWhite">
              		<div class="col-sm-12 marginBottom2Ten" style="padding:0;">
	              		<div class="col-sm-5 partTurnPage" style="min-width: 230px;">
	              			<div id="stationEcharts" class="col-sm-12" style="height: 210px;margin-top:0"></div>
	              			<div class="col-sm-12">
	              				<div class="marginBottomTen"><div class="equipmentSOCdiv1">开始SOC: <span id="startSOC">0</span></div></div>
	              				<div><div class="equipmentSOCdiv2">实充SOC: <span id="totalSOC">0</span></div></div>
	              			</div>
	              		</div>
	              		<div class="col-sm-3 partTurnPage" style="margin-top:40px;">
	              			<div class="col-sm-12">
		              			<div class="marginBottomTen fontGreen"><span style="font-size: 32px;" id="chargedKWH"></span></div>
		              			<div class="marginBottom6Ten">已充电量(KW·H)</div>
		              			
	              			</div>
	              			<div class="col-sm-12">
		              			<div class="marginBottomTen fontGreen"><span style="font-size: 32px;" id="chargedTime"></span></div>
	              				<div>已充时间</div>
	              			</div>
	              		</div>
	              		<div class="col-sm-4" style="margin-top:40px;">
		              		<div class="col-sm-12 marginBottom2Ten" >
	              				<div class="equipmentRealMsg" id="outputVoltageValue"><span id="outputVoltage">0</span> / 750</div>
			              		<div class="progress">
								  <div class="progress-bar" id="outputVoltageProgress" role="progressbar" aria-valuemin="0" aria-valuemax="100" style="color:black">
								  </div>
								</div>
								<div class="partTurnPage">输出电压(V)</div>
							</div>
							<div class="col-sm-12 marginBottom2Ten">
								<div class="equipmentRealMsg" id="outputElectricValue"><span id="outputElectric">0</span> / 600</div>
			              		<div class="progress">
								  <div class="progress-bar" id="outputElectricProgress" role="progressbar" aria-valuemin="0" aria-valuemax="100" style="color:black">
								  </div>
								</div>
								<div class="partTurnPage">输出电流(A)</div>
							</div>
							<div class="col-sm-12 marginBottom2Ten">
								<div class="equipmentRealMsg" id="outputPowerValue"><span id="outputPower">0</span> / 450</div>
			              		<div class="progress">
								  <div class="progress-bar" id="outputPowerProgress" role="progressbar" aria-valuemin="0" aria-valuemax="100" style="color:black">
								  </div>
								</div>
								<div class="partTurnPage">输出功率(KW)</div>
							</div>
	              		</div>
              		</div>
              	</div>
            </div>
          </div>
		</div>
		<div class="col-sm-12 oneWidth">
		    <div class="col-sm-4 AhalfWidth">
		    	<div class="comTitle bacWhite"><span class="borBlue"></span>车辆信息</div>
              	<div class="comBody bacWhite" id="detailThreeBody"></div>
            </div>
	    	<div class="col-sm-8 AhalfWidth">
              	<div class="comTitle bacWhite"><span class="borBlue"></span>充电曲线</div>
              	<div class="comBody bacWhite" style="padding: 0px;">
              		<div id="histogram" class="comBody bacWhite"></div>
              	</div>
		  	</div>
		</div>
      </div>
  </div>
</body>
</html>
